@media  screen and (max-width:900px) {
   .fcolumn{
       display: flex;
       flex-direction: column;
       margin-bottom: 40px;
   }
   .fcolumn >div{
       width: 100%;
   }
   .wni{
       flex-direction: column;
       width: 100%;
   }
   .gridc{
      display: flex;
      flex-direction: column;
   }
}
@media  screen and (max-width:600px) {
    footer #container{
        grid-template-columns: repeat(1,1fr);
    }
    footer #container  div{
        display: flex;
    }
}
@media  screen and (max-width:500px){
    header{
        display: none;
    }
    .flexc{
        display: flex;
        flex-direction: column;
        align-items: center;
    }
    .flexc > div{
        width: 90%;
        margin: auto;
    }
    .font{
        font-size: 1.3em;
    }
    .inputn{
        display: flex;
        flex-direction: column;
    }
    .wni input{
        /* width: 100%; */
    }
}